<!DOCTYPE html>
<html>
    <head>
        
        <link rel="stylesheet" type="text/css" href="css/ui-lightness/jquery-ui-1.8.18.custom.css" />
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
        <script src="js/highcharts.js" type="text/javascript"></script>
        <script src="http://code.highcharts.com/modules/exporting.js" type="text/javascript"></script>
        <script src="graph.js" type="text/javascript"></script>
        <script src ="js/jquery-ui-1.8.18.custom.min.js" type="text/javascript"></script>
        <style type="text/css">
            .center {
                margin-left: auto; 
                margin-right: auto;
                width: 630px;
                
            }
            #compareList ul{
                list-style-type: none;
                padding: 0;
                margin-left: 0;
            }
        </style>
        <script type="text/javascript">

    
        $(function() {
            //populate the select
            $.get('getDomain.php', function(data) {
       
                var dataArray = $.parseJSON(data);
               
                $('#domain').append('<option value="0">All Domains</option>');
                $('#firstOrg').data('id','552');
                $('#firstOrg').val('West Virginia University');
                for (var i=0;i<dataArray.length;i++) {
                    $('#domain').append('<option value="' + dataArray[i].id + '">' + dataArray[i].domainName + '</option>');
                }
                //set selected to CS
                $('#domain option').eq(0).attr('selected', 'selected');
                populateSubDomain(0);
            });
            
            $('#domain').change( function() {
                populateSubDomain($('#domain :selected').val());
            });
    
            $( "#slider" ).slider({
                        range: true,
                        min: 1960,
                        max: 2010,
                        values: [ 1980, 2010 ],
                        slide: function( event, ui ) {
                                $( "#year" ).val(ui.values[ 0 ] + " - " + ui.values[ 1 ] );
                        }
                });
                $( "#year" ).val( $( "#slider" ).slider( "values", 0 ) +
                        " - " + $( "#slider" ).slider( "values", 1 ) );
    
       
            addAutocomplete('firstOrg');
            addAutocomplete('secondOrg');
            
                $( "#dialog" ).dialog({
                        autoOpen: false,
                        show: "clip",
                        hide: "fold",
                        height: "780",
                        width: "600",
                        close: function(ev, ui) { 
                            $('#compareLeft').html('');
                        }
                });

                $( "#opener" ).click(function() {
                        $( "#dialog" ).dialog( "open" );
                        return false;
                });
    
                //$('#rankUniversites').change(getRanked);
                $('#recordStart').val('0');
                
                /*$('#checkBoxDiv').buttonset();
                $('#normalizeButton').button();*/
    
        });
         
         function addAutocomplete (inputId) {
               $("#"+inputId).autocomplete({
                    source: function( request, response ) {
                    $.ajax({
                        url: "getOrg.php",
                        dataType: "json",
                        data: {
                            term: request.term
                        },		
                        success: function( data ) {
                            response( $.map( data, function( item ) {
                                return {
                                    label: item.value,
                                    value: item.value,
                                    id: item.id			}
                                }));
                        }
                    });
                    },
                    minLength: 3,
                    select: function( event, ui ) {
                         //$("#"+inputId).data("id",ui.item.id);
                         
                         addUniversity(ui.item.id, ui.item.value);
                    }
            });
         
         }
    
        function populateSubDomain(topDomain) {
            $.get('getSubDomain.php', {domainID: topDomain}, function(data) {
                 var dataArray = $.parseJSON(data);
                  $('#subDomain').html('');
                 $('#subDomain').append('<option value="0">Overall</option>');
                 for (var i=0;i<dataArray.length;i++) {
                    $('#subDomain').append('<option value="' + dataArray[i].subDomainID + '">' + dataArray[i].subDomainName + '</option>');
                 }
                   $('#subDomain option').eq(0).attr('selected', 'selected');
            });
        }
        
       function buildRequest() {
            var request = new Object();
            request.u1 = $("#firstOrg").data('id'); 
            request.u2 = $('#compareList0').data('id');
            request.u3 = $('#compareList1').data('id');
            request.u4 = $('#compareList2').data('id');
            request.u5 = $('#compareList3').data('id');
            request.u6 = $('#compareList4').data('id');
            request.u7 = $('#compareList5').data('id');
            request.u8 = $('#compareList6').data('id');
            request.u9 = $('#compareList7').data('id');
            request.u10 = $('#compareList8').data('id');
            request.u11 = $('#compareList9').data('id');
            request.domainID = $('#domain :selected').val();
            request.subDomainID = $('#subDomain :selected').val();
            request.yearStart = $( "#slider" ).slider( "values", 0 );
            request.yearEnd = $( "#slider" ).slider( "values", 1);
            request.calcHIdx = ($('#calcHIdx').is(':checked')) ? '1' : '0';
            
            
            
            return request;
        }
        
        function createSchoolArray() {
            var schoolArray = new Array();
            schoolArray.push($("#firstOrg").val());
            
            $("#compareList li").each(function(){
                
                schoolArray.push($(this).text());
            });
            
            return schoolArray;
        }
    
        function getPub(firstID,secondID,firstOrg,secondOrg) {
            $('#loadingImg').show();
            $('#container').html('');
            $('#container2').html('');
            var domainID = $('#domain :selected').val();
            var subDomainID = $('#subDomain :selected').val();

			var startTime = new Date().getTime();
            
            $.get('MASnew.php', buildRequest(), function(data) {
             
               
                 var dataArray = $.parseJSON(data);
                 var schoolArray = createSchoolArray();
                
                
                 $('#normalizeButton').data('school',schoolArray);
                  $('#normalizeButton').data('all',dataArray);
                 
                 var title = 'Publications per Year';
                 var data = normalizeData(false,false,false);
                
				 alert(Math.floor((new Date().getTime() - startTime)/1000));
                 
                 makeGraph('container',schoolArray, data, dataArray.yearArray, title);
                 //$('#compareList').html('');
                 //title = 'Publications per Year';
                 //makeGraph('container2',firstOrg,secondOrg,dataArray.firstSchool, dataArray.secondSchool, title);
                  $('#loadingImg').hide();
                  //$('#toggleButton').show();
            });
        }
        
        function addUniversity(id,text) {
         
       
            
            var numChild = $('#compareList').children().length;
            
            $('#compareList').append('<li id="compareList' + numChild + '" >' + text + '</li>');
            
            $('#compareList' + numChild).data('id',id);
           /* $('#closeButton' + numChild).click(function() {
                 alert($('#compareList' + numChild).attr('id'));
                 $('#compareList' + numChild).remove();
            });*/
           // $('#secondOrg').val('');
        }
        
        
        function graphIt() {
            getPub($("#firstOrg").data('id'), $("#secondOrg").data('id'), 
                $("#firstOrg").val(), $("#secondOrg").val());
        }
        
        function toggleData() {
            
            var dataArray = $('#normalizeButton').data('all');
            var byAuthors, byHidx, byFunding;
            
            byAuthors = $('#check1').is(':checked');
            byHidx = $('#check2').is(':checked');
            byFunding = $('#check3').is(':checked');
         
                     
            var title = "Publications ";

            if ($('#checktoggle').is(':checked')) {
				title = "Citations ";
            }
            
            if (byAuthors || byHidx || byFunding) {
                title += "Normalized by "
            }
            
            if (byAuthors) {
                title += "Authors ";
            }
            if (byHidx) {
                title += "h-index ";
            }
            if (byFunding) {
                title += "Funding ";
            }
         
            var schools = $('#normalizeButton').data('school');
            
            var normArray = normalizeData(byAuthors, byHidx, byFunding);
            
            makeGraph('container',schools,normArray, dataArray.yearArray, title);
             
      
  
            }
        
        
        function normalizeData(byAuthors, byHidx, byFunding) {
            var dataArray = $('#normalizeButton').data('all');
            var normalizedArray = new Array();
            for (var i = 0; i < dataArray.schools.length; i++) {
                normalizedArray[i] = new Array(dataArray.schools[0].length);
            }
            
            
           
            
            for (var j = 0; j < dataArray.schools.length; j++) {
            var nextSchool = dataArray.schools[j]
            
            
            for (i = 0; i < nextSchool.length; i++) {
                var tempObj = new Object();
                if ($('#checktoggle').is(':checked')) {
                    tempObj.num = parseFloat(nextSchool[i].citations);
                }
                else {
                	tempObj.num = parseFloat(nextSchool[i].totalPub);
                }
                tempObj.text = "";
                normalizedArray[j][i] = tempObj;
               
            }
            
            if (byAuthors) {
                for (i = 0; i < nextSchool.length; i++) {
                    normalizedArray[j][i].num = parseFloat(normalizedArray[j][i].num)/parseFloat(nextSchool[i].authorCount);
                    normalizedArray[j][i].text += "Authors: " + nextSchool[i].authorCount;
                }
            }
            if (byHidx) {
                for (i = 0; i < nextSchool.length; i++) {
                    normalizedArray[j][i].num = parseFloat(normalizedArray[j][i].num) * (parseFloat(nextSchool[i].hIdx)/100);
                    normalizedArray[j][i].text += " h-index: " + nextSchool[i].hIdx;
                    
                }
            }
            if (byFunding) {
                for (i = 0; i < nextSchool.length; i++) {
                    
                    var funding = 1;
                    if (parseFloat(nextSchool[i].funding) != 1) {
                        funding = parseFloat(nextSchool[i].funding)/1000;
                    }
                    
                    normalizedArray[j][i].num = parseFloat(normalizedArray[j][i].num)/funding;
                    normalizedArray[j][i].text += " Funding: " + funding;
                }
            }
            
           /* for (i = 0; i < nextSchool.length; i++) {
                normalizedArray[j][i].num = normalizedArray[j][i].num.toFixed(2);
               
            }*/
               
            }
        
            return normalizedArray;
        }

        function getRanked() {
                
                var type = $('#rankUniversites :selected').val();
                var next = $('#recordStart').val();
                
                if(next == null) {
                    next = 0;
                }
           
                $.get('getOrgByRank.php', {type: type, next: next}, function(data) {
                 
                 var dataArray = $.parseJSON(data);
                  buildUniversityDiv(dataArray);
                  $('#recordStart').val(parseInt(next) + 10);
        });
            
            
        }

        function buildUniversityDiv (dataArray) {
            //clear the div
            $('#rankings').html('');
            var beginHtml = '<div class="Udiv" style="border-style: solid" id="'
            var begin2 =     '"><p align="left">';
            var end = '</p></div>';
            
            for (var i=0;i<dataArray.length;i++) {
                var id = dataArray[i].id;
                var name = dataArray[i].name;
                var html = beginHtml;
                html += id + begin2 + name + '<br />'; 
                html += 'h:  ' + dataArray[i].hIdx + '  g:  ' + dataArray[i].gIdx + end;           
                $('#rankings').append(html);
                $('#' + id).data('name',name);
                
            }
            
            bindDivClicks();
        }

        function bindDivClicks () {
            $('.Udiv').click(function() {
                  
                    addUniversity($(this).attr('id'),$(this).data('name'));
                    $('#compareLeft').append($(this).html());
            });
            $('.Udiv').css('cursor', 'pointer');
       }    

        </script>
        
    </head>
    
    <body>
        
        <div id="topDiv"  class="center" >
            <div align="center">
                
                <div id="selectDiv" style="" >
                    <div id="domainDiv" style="float: left; width: 277px;">
                        <select id="domain"></select>
                    </div>
                    
                    <div id="subDomainDiv" style="float: left; width: 277px; margin-left: 55px">
                        <select id="subDomain"></select>
                    </div>
                </div>
                
                <div id="searchDiv"  style="clear: both">
                    <div id="firstOrgLivesearch" style="float: left; width: 300px; " >
                        <input id="firstOrg" type="text" size="40" maxlength="40"/>
                        
                    </div>
                    <div style="float: left; width: 40px;  margin-left: 10px; margin-right: 10px;"></div>
                    <div id="secondOrgLivesearch" style="float: left; width: 300px" >
                        <input id="secondOrg" type="text" size="40" maxlength="40"/>
                        
                    </div>
                   
                    <!--   <button id="opener" type="button" style="float: right; margin-left: 10px">Select School</button> -->
                    
                </div>
                
                  <button type="button" style="clear: both; margin-left: 10px" onclick="graphIt()" >Go</button>
                  <input type="checkbox" id="calcHIdx" /><label for="calcHIdx">Calculate h-index</label>
                
                <div id="sliderDiv"   style="clear: both">
                    <p align="center">
                        <label for="year">Year Range:</label>
                        <input type="text" id="year" style="border:0; font-weight:bold;" />
                    </p>
                    
                    <div id="slider"></div>
                </div>
                <div id="compareListDiv"  style="clear: both">
                  
                    <ul id="compareList" style="list-style-type: none; padding: 0; margin-left: 0; border: solid" ></ul>
                    
                </div>
                
                
                <div id="checkBoxDiv" style="clear: both">
                	
                    <input type="checkbox" id="check1" /><label for="check1">Authors</label>
                    <input type="checkbox" id="check2" /><label for="check2">h-index</label>
                    <input type="checkbox" id="check3" /><label for="check3">Funding</label>
                </div>
                
                <button id="normalizeButton" type="button" style="clear: both" onclick="toggleData()" >Normalize</button> 
                <input type="checkbox" id="checktoggle" /><label for="checktoggle">Citations</label>
                
                <div id="imageDiv"  style="clear: both;     margin-left: auto; 
                     margin-right: auto;
                     width: 100%">
                    <img id="loadingImg"   style="display: none" src="loading.gif"/>    
                </div>
            </div>
        </div>
        
        <div id="graphs" align="center" style="clear: both;  margin-left: auto; 
             margin-right: auto;  width: 80%;">
            <div ID="container"></div>
            <div ID="container2"></div>
        </div>
        
        
        <div id="dialog" align="center">
            <div id="compareLeft" style="width:260px;  float: left; border-style: solid; border-left:#FFFFFF"></div>
            <div id="compareRight" style="width: 260px;  float: left;  border-style: solid; border-right:#FFFFFF">
                <div id="rankDiv" align="center">
                    <select id="rankUniversites" >
                        
                        <option value="0">h-index</option>
                        <option value="1">g-index</option>
                        <option value="2">similar h-index</option>
                        
                    </select>
                    
                    <button id="next" onclick="getRanked()">Next</button>
                    <input id="recordStart" type="text" size="6" maxlength="6"/>
                </div>
                <div id="rankings">
                    
                </div>
            </div>
        </div>
        
    </body>
    
</html>